<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:fragment="common_header(title)">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title th:replace="${title}">Product Center</title>
    <link rel="stylesheet" href="/front/css/basic.css" type="text/css" />
    <link rel="stylesheet" href="/front/css/mycontent.css" type="text/css" />
    <link rel="stylesheet" href="/front/css/style.css" type="text/css" />
    <link rel="stylesheet" href="/front/js/swiper/swiper.min.css">
    <script type="text/javascript" src="/front/js/jquery-1.11.1.min.js"></script>
    <script src="/front/js/swiper/swiper.min.js"></script>
    <script type="text/javascript" src="/front/js/index.js"></script>
</head>
<body class="layui-layout-body" th:fragment="common_body(main)">

<header>
    <div class="header-box">
        <div align="center" class="logo">
            <a href="/zh">
                <img src="/front/images/logo.png" alt="logo">
            </a>
        </div>
        <ul class="menu-list">
            <li class="active" menu-id="home">
                <a href="/zh" class="menu-text">
                    <span>首页</span>
                </a>
            </li>
            <li class="active" menu-id="about">
                <a href="/zh/aboutUs" class="menu-text">
                    <span>关于我们</span>
                </a>
            </li>
            <li menu-id="profile">
                <a href="javascript:;" class="menu-text">
                    <span>多元业务</span>
                    <img src="/front/images/icon_down.png" class="down" alt="">
                    <img src="/front/images/icon_up.png" class="up" alt="">
                </a>
                <div class="sub-menu">
                    <p>
                        <a href="/zh/yunshang">华衣云商</a>
                        <a href="/zh/jinlin">锦麟科技</a>
                    </p>
                </div>
            </li>
            <li menu-id="contact">
                <a href="/zh/contact" class="menu-text">
                    <span>联系我们</span>
                </a>
            </li>
            <li>
                <a href="/zh/news" class="menu-text">
                    <span>新闻中心</span>
                </a>
            </li>
        </ul>
        <div class="change-btn"><a href="/en">ENGLISH</a></div>
    </div>
    <div class="phone-menu-box">
        <div class="phone-menu">
            <img src="/front/images/menu.png" class="show-menu" alt="">
            <img src="/front/images/logo.png" class="phone-logo" alt="">

        </div>
        <div class="phone-menu-list">
            <div class="menu-box">
                <div class="menu-item">
                    <a href="/zh">首页</a>
                </div>
                <div class="menu-item">
                    多元业务
                    <div class="phone-sub-menu">
                        <a href="/zh/yunshang">华衣云商</a>
                        <a href="/zh/jinlin">锦麟科技</a>
                    </div>
                </div>
                <div class="menu-item">
                    <a href="/zh/contact" >联系我们</a>
                </div>
                <div class="menu-item">
                    <a href="/en">ENGLISH</a>
                </div>
            </div>
        </div>
    </div>

</header>


<div class="content-wraper" th:replace="${main}">
</div>
<footer>
    <div class="container footer-box">
        <div class="left">
            <ul class="menu-list">
                <li>
                    <a href="/zh" class="menu-text">
                        <span>HOME</span>
                    </a>
                </li>
                <li>
                    <a href="/zh/yunshang" class="menu-text">
                        <span>HUAYIYUNSHANG</span>
                    </a>
                </li>
                <li>
                    <a href="/zh/jinlin" class="menu-text">
                        <span>JINLIN INTELLIGENT</span>
                    </a>
                </li>
                <li>
                    <a href="/zh/contact" class="menu-text">
                        <span>CONTACT US</span>
                    </a>
                </li>
                <li>
                    <a href="/zh/news" class="menu-text">
                        <span>NEWS</span>
                    </a>
                </li>

            </ul>
            <div>
                <span>广东华衣科技股份有限公司 版权所有@Copyright2018 </span><span>电话：0769-83198288</span><span>
                         粤ICP备17134301号</span>
            </div>
            <div>
                ADDRESS: 42 JUXIN ER LU, DALANG TOWN, DONGGUAN CITY, GUANGDONG PROVINCE, CHINA
            </div>
        </div>
        <div class="right-box">
            <img src="/front/images/code.jpg" alt="">
        </div>
    </div>
</footer>
<script>
    $(function () {
        var menuId='[[${menuId}]]';
        $(".menu-list li").each(function (i) {
            var mid = $(this).attr('menu-id');
            if(menuId!="" && mid!=""){
                if(mid == menuId){
                    $(this).addClass("active")
                }else{
                    $(this).removeClass("active")
                }
            }
        })
    })
</script>
</body>
</html>
